/* Bootstrap 3 complementary styles */
/* For oeioei.nl */

/* Make the fixed top and bottom navbar the same with as the container */
.navbar-center {
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 768px) {
	.navbar-center {
		width: 750px;
	}
}

@media (min-width: 992px) {
	.navbar-center {
		width: 970px;
	}
}

@media (min-width: 1200px) {
	.navbar-center {
		width: 1170px;
	}
}



/* Prevent navbar to collapse when screen becomes too small*/

@media (max-width: 767px) {
	.navbar-nav-nocollapse {
		float: left;
		margin: 0;
	}

	.navbar-nav-nocollapse > li {
		float: left;
	}

	.navbar-nav-nocollapse > li > a {
		padding-top: 15px;
		padding-bottom: 15px;
	}
}


@media (max-width: 767px) {
	.navbar-nav {
		position: relative;
		float: right;
		width: auto;
	}
}


.navbar-header {
	float: left;
}


.navbar-footer {
	height: 35px;
	min-height: 35px;
}


/* Make my brand bold and big and avoid padding in between top menu bar */
.mybrand {
	font-weight: bold;
	font-size: 25px;
	padding-right: 0px;
}


/* Avoid padding in between top menu bar */
.navmenu {
	padding-left: 0px;
}


/* Center last updated column */
.lastupdate {
	text-align: center;
	padding-top: 7px;
	padding-bottom:0px;
}

.lastupdate > a {
	color: #000;
	text-decoration: none;
}

.lastupdate > a:hover {
	color: #fff;
}

.navbar-nav>li>a.vcenter {
	padding-top: 7px;
	padding-bottom: 0px;
}


/* Put buttons a little closer together on a narrow screen */
@media (max-width: 767px) {
.navbar-nav>li>a {
	padding-left: 10px;
	padding-right: 10px;
}
}


/* Corrections needed for the drop down button */
.drop-btn {
	padding-top: 15px;
	padding-bottom: 15px;
}

.btn-link > drop-btn {
	color: #000;
}

.drop-btn > a:hover {
	color: #fff;
}


/* Some default style elements */
h4 {
	margin-top: 25px;
}

.extraindent {
	margin-left: 15px;
}

hr {
	border-color: #000;
}


.nowrap {
	white-space: nowrap;
}

thead {
	font-weight: bold;
}

.t_indent {
	margin-left: 25px;
	width: 95%;
}

@media (max-width: 768px) {
.t_indent {
	margin-left: 15px;
}
}

/* Placing images */
.img-left {
	max-width: 100%;
	height: auto;
	border: 0px;
	float: left;
	margin-right: 10px;
	margin-bottom: 5px;
}

.img-right {
	max-width: 100%;
	height: auto;
	border: 0px;
	float: right;
	margin-left: 10px;
	margin-bottom: 5px;
}

.img-center {
	max-width: 100%;
	height: auto;
	border: 0px;
	text-align: center;
	margin-top: 5px;
	margin-bottom: 5px;
}

.img-thumbnail {
	border: 0px;
}


/* Mono space styles */
.pre-big {
	font-size: 16px;
}


/* Tile related styles */
.tile-title {
	background-color: #ded;
	padding-left: 20px;
	padding-top: 7px;
	padding-bottom: 7px;
}


/* Styles for file format descriptions */
.ff-bc {
	color: #cc0000;
}

.ff-cs {
	color: #ff9900;
}

.ff-ad {
	color: #3333ff;
}

.ff-da {
	color: #00cc00;
}

.ff-flg {
	color: #000;;
}


.logic-not {
	text-decoration: overline;
}

/* ------------------------------------------------------------------------ */


/* oeioei topic styles */

.topic-internet {
	color: #c00000;
}

.topic-internet:hover {
	color: #c00000;
}

.topic-internet:visited {
	color: #c00000;
}

.topic-internet:link {
	color: #c00000;
}

.topic-internet-inverse {
	background-color: #c00000;
	color: #ffffff;
}


.topic-new {
	color: #0000c0;
}

.topic-linux {
	color: #900050;
}

.topic-huis {
	color: #eb7f25;
}

.topic-dyk {
	color: #4444ee;
}

.topic-whyoeioei {
	color: #4444ee;
}

.topic-nolink {
	color: #337ab7;
}

.no-extra-margin {
	margin-top: 0px;
	margin-bottom: 10px;
}

address {
	margin-top: 15px;
	font-style: italic;
}

/* ----------------------------------------------- */
/* Oeioei title */

.oei-title {
	position: fixed;
	z-index: 1030;
	top: 0;
	left: 0;
	right: 0;
	margin-right: auto;
	margin-left: auto;
	background-color: #ffffff;
}

@media (min-width: 768px) {
    .oei-title {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .oei-title {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .oei-title {
        width: 1170px;
    }
}

h1 {
	margin-top: 10px;
	color:#4444ee;
}

/* Make some vertical room for the top nav bar in the body */
body {
	padding-top: 62px;
	padding-bottom:  0px;
}

/* HR styles for the different topics */

.index-line {
	border-color: #4444ee;
	margin-top: 10px;
	margin-bottom: 10px;
}

.internet-line {
	border-color: #c00000;
	margin-top: 0px;
	margin-bottom: 10px;
}


.huis-line {
	border-color: #eb7f25;
	margin-top: 0px;
	margin-bottom: 10px;
}

.linux-line {
	border-color: #900050;
	margin-top: 0px;
	margin-bottom: 10px;
}

.menu-topics {
	color: black;
	text-decoration: none ;
}

h2, h3 {
	font-weight: bold;
}

/* Inline code */
.inline-code {
	font-family: monospace;
	color: #cc0077;
	white-space: nowrap;
}


.oei-navigation {
	padding: 0px;
	border: 0px;
	border-top: 2px;
	border-style: solid;
}

.oei-nav-internet {
	padding-top: 2px;
	border-color: #c00000;
	text-decoration: none;
}

.oei-navbutton-internet {
	background-color: #c00000;
	color: #ffffff;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 4px;
	padding-bottom: 4px;
	font-weight: bold;
	white-space: nowrap;
}

.oei-navbutton-internet:link {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-internet:visited {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-internet:hover {
	color: yellow;
	text-decoration: none;
}

.oei-navbutton-internet:active {
	color: yellow;
	text-decoration: none;
}

.oei-nav-huis {
	padding-top: 2px;
	border-color: #eb7f25;
	text-decoration: none;
}

.oei-navbutton-huis {
	background-color: #eb7f25;
	color: #ffffff;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 4px;
	padding-bottom: 4px;
	font-weight: bold;
	white-space: nowrap;
}

.oei-navbutton-huis:link {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-huis:visited {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-huis:hover {
	color: yellow;
	text-decoration: none;
}

.oei-navbutton-huis:active {
	color: yellow;
	text-decoration: none;
}

.oei-nav-linux {
	padding-top: 2px;
	border-color: #900050;
	text-decoration: none;
}

.oei-navbutton-linux {
	background-color: #900050;
	color: #ffffff;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 4px;
	padding-bottom: 4px;
	font-weight: bold;
	white-space: nowrap;
}

.oei-navbutton-linux:link {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-linux:visited {
	color: #ffffff;
	text-decoration: none;
}

.oei-navbutton-linux:hover {
	color: yellow;
	text-decoration: none;
}

.oei-navbutton-linux:active {
	color: yellow;
	text-decoration: none;
}


/* ----------------------------------------------- */

/* Setup the color scheme */
/* https://work.smarchal.com/twbscolor/css/e74c3cc0392becf0f1ffbbbc0 */